<template>
  <view>
    <scroll-view class="list-container" scroll-y="true">
      <view class="list-item" v-for="(item, index) in tabMenuList" :key="index" @click="() => {
        onTabClick(index, item)
      }">
        <view style="font-family:NotoSansSC-Medium;font-size:28rpx">{{ item.title }}</view>
        <button   v-if="index==2" class='kf' open-type="contact"><text class='text-grey'>客服按钮</text></button>
        <view style="width: 64rpx;height: 64rpx;"> <img
            src="https://100000063-1252208446.file.myqcloud.com/images/right1.png" alt=""
            style="width: 64rpx;height: 64rpx;vertical-align: middle;"></view>
      </view>
    </scroll-view>
    <view class="bottom_area">
      <view class="img-container" @click="gotoOtherMiniapp">
        <img src="https://100000063-1252208446.file.myqcloud.com/images/MF-EB-P4/WDMKLZL.png"
          style="margin-bottom: 32rpx;" class="bottom_imgs">
      </view>
      <view class="img-container" @click="gotowx">
        <img src="https://100000063-1252208446.file.myqcloud.com/images/MF-EB-P4/GZGZH.png" class="bottom_imgs">
      </view>
    </view>

  </view>
</template>

<script>
export default {
  data() {
    return {
      tabMenuList: [
        {
          title: '我的活动',
          path: '/pages/customer/recordList',
          iconFt: 'mcl-jilu',
          authorizationRequired: true,
          index: 1,
          hasChild: false,
        },
        {
          title: '收货地址',
          path: '/pages/customer/address',
          authorizationRequired: true,
          iconFt: 'mcl-dizhi',
          index: 2,
          hasChild: false,
        },
        {
          title: '专属客服',
          path: '/pages/order/list',
          authorizationRequired: true,
          iconFt: 'mcl-gerenxinxi',
          index: 3,
          hasChild: false,
        },

        {
          title: '规章/营业资质',
          path: '/pages/customer/settings',
          authorizationRequired: true,
          iconFt: 'mcl-xuzhi',
          index: 5,
          hasChild: false,
        },
      ],
    }
  },

  mounted() {
  },
  methods: {
    //  跳转麦卡伦TMS小程序
    gotoOtherMiniapp(){
      uni.openEmbeddedMiniProgram({
        appId: 'wxd77b68985ec0c0ef',
        path: 'pages/index/reg',
        success(res) {},
        fail(res) {}
      });
    },
    onTabClick(index, item) {
      switch (index) {
        case 0:
          this.$commonSensors.commonPageClick('MemberPageClick', '我的活动')
          uni.openEmbeddedMiniProgram({
            appId: 'wxd77b68985ec0c0ef',
            // path: 'pages/index/reg?cl_ctnm=My_Banner&cl_source1=1017',
            path: 'pages/AlcoholCondition/myActiveList',
            success(res) {},
            fail(res) {}
          });
          break;
        case 1:
          this.$commonSensors.commonPageClick('MemberPageClick', '收货地址')
          uni.navigateTo({ url: item.path })
          break;
        case 2:
          this.$commonSensors.commonPageClick('MemberPageClick', '专属客服')
          // uni.navigateTo({ url: item.path })
          break;
        default:
          this.$commonSensors.commonPageClick('MemberPageClick', '规章/营业资质')
          uni.navigateTo({ url: item.path })
      }
    },
    //  跳转微信公众号页面
    gotowx(){
      uni.navigateTo({
        url: '/pages/public-account/public-account',
      })
    }
  },
}
</script>

<style scoped>
.list-container {
  width: 654rpx;
  height: 100%;
  margin-left: 48rpx;
}

.list-item {
  position: relative;
  height: 160rpx;
  line-height: 160rpx;
  border-bottom: 1px solid #F2F2F2;
  display: flex;
  justify-content: space-between;
  font-family: 'Noto Sans SC';
  font-style: normal;
  font-weight: 400;
  font-size: 28rpx;
  /* padding-left: 24rpx; */
}

.img-container {
/*  width: 750rpx;
  height: 192rpx; */
  font-size: 0;
}
.kf{
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0 !important;
}
.bottom_imgs{
  width:654rpx;
  height: 192rpx;
}
.bottom_area{
  width: 100%;
  padding: 48rpx;
}
</style>
